﻿@using xConnected.Common.Login
@using xConnected.Core.Model
<!DOCTYPE html>
<!--[if lt IE 7 ]> <html lang="en" class="no-js ie6"> <![endif]-->
    <!--[if IE 7 ]>    <html lang="en" class="no-js ie7"> <![endif]-->
        <!--[if IE 8 ]>    <html lang="en" class="no-js ie8"> <![endif]-->
            <!--[if IE 9 ]>    <html lang="en" class="no-js ie9"> <![endif]-->
                <!--[if (gt IE 9)|!(IE)]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
                    <html lang="en">
                        <head>
                            <meta charset="utf-8">
                            <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
                            <title>@ViewBag.Title</title>    
                            <meta name="viewport" content="width=device-width, initial-scale=1.0">
                            <meta name="description" content="">
                            <meta name="author" content="">
                            <link rel="shortcut icon" href="../../Content/img/favicon.ico" type="image/x-icon" />
   
                            <!-- Javascript -->
                            @*<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js"> </script>
                            <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"> </script>*@
                            <script src="../../Scripts/jquery-1.7.2.min.js" type="text/javascript"> </script>
                            @*<script src="../../Scripts/jquery-ui-1.8.20.min.js" type="text/javascript"> </script>*@
                            <script src="../../Content/jquery_ui_custom/jquery-ui-1.9.0.custom.min.js" type="text/javascript"></script>
                            <script src="../../Scripts/jquery.filedrop.js" type="text/javascript"> </script>
                            <script src="../../Scripts/jquery.tmpl.min.js" type="text/javascript"> </script>
                            <script type="text/javascript" src="../../Scripts/uploadify/swfobject.js"> </script>
                            <script type="text/javascript" src="../../Scripts/uploadify/jquery.uploadify.v2.1.4.min.js"> </script>
                            <script src="../../Scripts/modernizr-2.5.3.js" type="text/javascript"> </script>
                            <script src="../../Scripts/sammy.js" type="text/javascript"> </script>
                            <script src="../../Scripts/tinymce/jscripts/tiny_mce/tiny_mce.js" type="text/javascript"> </script>
                            <script src="../../Scripts/jquery.tiynmce.js.js" type="text/javascript"> </script>
                            <script src="../../Scripts/knockout-2.1.0.debug.js" type="text/javascript"> </script>
                            <script src="../../Scripts/KnockoutValidation/knockout.validation.js" type="text/javascript"> </script>
                            <script src="../../Scripts/KnockoutBindings.js" type="text/javascript"> </script>
                            <script src="../../Scripts/jqueryAutocomplete/jquery-autocomplete.min.js" type="text/javascript"> </script>
                            <script src="../../Scripts/linq.js/jquery.linq.js" type="text/javascript"> </script>
                            <script src="../../Scripts/linq.js/linq.js" type="text/javascript"> </script>
                            @*<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"> </script>
                            <script src="../../Scripts/gmap3/gmap3.min.js" type="text/javascript"> </script>*@

                            <!-- Bootstrap-->
                            @*<link href="../../Content/Bootstrap/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css" />*@
                            <script src="../../Content/Bootstrap/js/bootstrap.js" type="text/javascript"> </script>
                            <link href="../../Content/Bootstrap/css/bootstrap.css" rel="stylesheet" type="text/css" />
                            <link href="../../Content/Bootstrap/css/bootstrap-custom.css" rel="stylesheet" type="text/css" />
                            @*  <link href="@Url.Content("~/Content/less/bootstrap.less")" rel="Stylesheet" />
                    	    <link href="@Url.Content("~/Content/less/responsive.less")" rel="Stylesheet" />*@

    
                            <!-- Styles-->
                            <link href="../../Content/themes/base/jquery.ui.all.css" rel="stylesheet" type="text/css" />
                           @* <link href="../../Content/jquery.ui_custom.css" rel="stylesheet" type="text/css" />*@
                            <link href="../../Content/jquery_ui_custom/jquery-ui-1.9.0.custom.min.css" rel="stylesheet"
                                type="text/css" />
                            <link href="../../Scripts/jqueryAutocomplete/jquery-autocomplete.css" rel="stylesheet"
                                  type="text/css" />
                            <style type="text/css">
                                #dropZonePhotoProfile {
                                    background-color: lightgray;
                                    width: 250px;
                                    height: 50px;
                                    padding: 50px;
                                    text-align: center;
                                    color: white;
                                }

                                #dropZonePhotoPosition {
                                    background-color: lightgray;
                                    width: 250px;
                                    height: 50px;
                                    padding: 50px;
                                    text-align: center;
                                    color: white;
                                }

                                #dropZoneCv {
                                    background-color: lightgray;
                                    width: 250px;
                                    height: 50px;
                                    padding: 50px;
                                    text-align: center;
                                    color: white;
                                }

                                #dropZonePhotoCompany {
                                    background-color: lightgray;
                                    width: 250px;
                                    height: 50px;
                                    padding: 50px;
                                    text-align: center;
                                    color: white;
                                }
                            </style>
                            <style type="text/css">
                                body
                                {
                                    padding-top: 60px;
                                    padding-bottom: 40px;
                                }
                            </style>
                            @RenderSection("JavaScript", false)        
                        </head>
                        <body>
                            <!--Models-->
                            <script src="../../Scripts/Models/Category.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/Country.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/CompanyProfile.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/Education.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/LanguageSkill.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/ExpertProfile.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/Position.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/Technology.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/TechnologySkill.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/LanguageModel.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/ExpertProfileAdvancedSearch.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/CompanyProfileAdvancedSearch.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/PositionAdvancedSearch.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/EducationSkill.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/CategorySkill.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/Industry.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/MessageFolder.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/Message.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/MessageExpertUser.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/MessageCompanyUser.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/MessagePositionUser.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Models/MessageUser.js" type="text/javascript"></script>
                            <script src="../../Scripts/Models/ExpertList.js" type="text/javascript"></script>
                            <script src="../../Scripts/Models/CompanyList.js" type="text/javascript"></script>
                            <script src="../../Scripts/Models/PositionList.js" type="text/javascript"></script>
                            <script src="../../Scripts/Models/BookmarkModel.js" type="text/javascript"></script>

                            <!--ViewModels-->
                            <script src="../../Scripts/ViewModels/LogOnViewModel.js" type="text/javascript"> </script>
                            <script src="../../Scripts/ViewModels/CategoryViewModel.js" type="text/javascript"> </script>
                            <script src="../../Scripts/ViewModels/CountryViewModel.js" type="text/javascript"> </script>
                            <script src="../../Scripts/ViewModels/CompanyViewModel.js" type="text/javascript"> </script>
                            <script src="../../Scripts/ViewModels/EducationViewModel.js" type="text/javascript"> </script>
                            <script src="../../Scripts/ViewModels/ExpertProfileViewModel.js" type="text/javascript"> </script>
                            <script src="../../Scripts/ViewModels/PositionViewModel.js" type="text/javascript"> </script>
                            <script src="../../Scripts/ViewModels/TechnologyViewModel.js" type="text/javascript"> </script>
                            <script src="../../Scripts/ViewModels/LanguagesViewModel.js" type="text/javascript"> </script>
                            <script src="../../Scripts/ViewModels/MessageFolderViewModel.js" type="text/javascript"> </script>
                            <script src="../../Scripts/ViewModels/BookmarkViewModel.js" type="text/javascript"></script>
                            <script src="../../Scripts/ViewModels/Main.js" type="text/javascript"> </script>
                            <script src="../../Scripts/Loading.js" type="text/javascript"> </script>
                            <div class="navbar navbar-fixed-top">
                                <div class="navbar-inner">
                                    <div class="container">
                                        <a class="brand" href="#/">Xpertica</a>
                                        <ul class="nav">
                                            <li>
                                                <div class="dropdown" style="margin-top: 10px">
                                                    <a class="dropdown-toggle"
                                                       data-toggle="dropdown"
                                                       href="#">
                                                        <i class="icon-globe"></i>
                                                        <b class="caret"></b>
                                                    </a>
                                                    <ul class="dropdown-menu">
                                                        <li><a href="../Home/SetCulture/en"><img src="../../Content/img/Flags/1338838270_gb.png" /> <small>English</small></a></li>
                                                        <li><a href="../Home/SetCulture/de"><img src="../../Content/img/Flags/1338838323_de.png" /> <small>German</small></a></li>
                                                        <li><a href="../Home/SetCulture/hr"><img src="../../Content/img/Flags/1338838369_Croatian-Flag.png" /> <small>Croatian</small></a></li>
                                                    </ul>
                                                </div>
                                            </li>
                                            <li class="divider-vertical"></li>
                                            @if (Request.IsAuthenticated)
                                            {
                                                <li data-bind="with: folder">
                                                    <div class="dropdown" style="margin-top: 10px">
                                                        <a class="dropdown-toggle" data-toggle="dropdown" href="#" data-bind="click: function(){ $root.folder.loadInbox() }">
                                                            <i class="icon-envelope"></i>
                                                            <b class="caret"></b>
                                                        </a>
                                                        <ul class="dropdown-menu" style="width: 300px; height: 300px;">
                                                            <li><div align="center"><a href="#"><small><strong style="text-align: center">Send new message</strong></small></a></div></li>
                                                            <li class="divider"></li>
                                                            <li><div align="center"><a href="#"><small><strong style="text-align: center">Messages:</strong></small></a></div></li>
                                                            <li data-bind="with: workingFolder">
                                                                <ul data-bind="foreach: Messages" class="unstyled">
                                                                    <li class="row-fluid" style="margin-left: 5px;">
                                                                        <a href="#">
                                                                            <span class="span6" data-bind="with: Sender"><span data-bind="text: Title" style="font-size: smaller"></span></span>
                                                                            <span class="span6" data-bind="text: Subject" style="font-size: smaller"></span>
                                                                        </a>
                                                                    </li>
                                                                </ul>
                                                            </li> 
                                                            <li class="divider"></li>
                                                            <li><div align="center"><a href="#"><small><strong style="text-align: center">See all messages</strong></small></a></div></li>
                                                        </ul>
                                                    </div>
                                                </li>
                                                <li class="divider-vertical"></li>
                                            }
                                            <li data-bind="css: { 'active': $root.route() == 'home' }">
                                                <a href="#/">@Login.Home</a>
                                            </li>
                                            @if (Request.IsAuthenticated)
                                            {
                                                <li class="dropdown">
                                                    <a class="dropdown-toggle"
                                                       data-toggle="dropdown"
                                                       href="#">
                                                        <span>@Login.Profile</span>
                                                        <b class="caret"></b>
                                                    </a>
                                                    <ul class="dropdown-menu">
                                                        <li>
                                                            <a href="#/Profiles">My Profiles</a>
                                                        </li>
                                                        @*<li>
                                                            <a href="#" data-bind="click: function(){ $root.company.setMyListRoute(); }">@Login.MyCompanyProfiles</a>
                                                        </li>
                                                        <li>
                                                            <a href="#" data-bind="click: function(){ $root.position.setMyListRoute(); }">@Login.MyPositions</a>
                                                        </li>*@
                                                        <li>
                                                            <a href="#" data-bind="click: function(){ $root.folder.setMessagesRoute(); }">Messages</a>
                                                        </li>
                                                    </ul>
                                                </li>
                                            }
                                            <li data-bind="css: { 'active': $root.route() == 'experts' }">
                                                <a href="#" data-bind="click: function(){ $root.profile.setListRoute(); }">@Login.Experts</a>
                                            </li>
                                            <li data-bind="css: { 'active': $root.route() == 'companies' }">
                                                <a href="#" data-bind="click: function(){ $root.company.setListRoute(); }">@Login.Companies</a>
                                            </li>
                                            <li data-bind="css: { 'active': $root.route() == 'Positions' }">
                                                <a href="#" data-bind="click: function(){ $root.position.setListRoute(); }">@Login.Positions</a>
                                            </li>
                                            <li class="divider-vertical"></li>
                                        </ul>
                                        <ul class="nav pull-right">
                                            <li >
                                                @if (Request.IsAuthenticated)
                                                {
                                                    <div class="dropdown add-on">
                                                        <a class="dropdown-toggle btn btn-small" data-toggle="dropdown" href="#">
                                                            <i class="icon-user"></i>
                                                            <span>@((Context.User.Identity).Name) </span>
                                                            <b class="caret"></b>
                                                        </a>
                                                        <ul class="dropdown-menu">
                                                            <li>
                                                                <a href="#"><small>Settings</small></a>
                                                            </li>
                                                            <li>
                                                                <a href="#"><small>Upgradge Account</small></a>
                                                            </li>
                                                            <li>
                                                                <a href="#" data-bind="click: function() { $root.logOn.signOut(); }"><small>@Login.SignOut</small></a>
                                                            </li>
                                                        </ul>
                                                    </div>
                                                }
                                                else
                                                {
                                                    <div class="form-inline">
                                                        <a data-toggle="modal" href="#SignInDialog" class="btn btn-small" data-bind="click: function() { $root.logOn.selectLogOnModel(); }" >@Login.SignIn</a>
                                                        <span class="divider-vertical"></span>
                                                        <a data-toggle="modal" href="#RegisterDialog" class="btn btn-small" data-bind="click: function() { $root.logOn.selectRegisterModel(); }">@Login.Register</a>
                                                    </div>
                                                }
                                            </li>
                                            
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            
                            <div class="container">
                                <div id="mainBody">
                                    <div style="height: 40px">
                                    @Html.Partial("Partial/Progress")
                                    </div>
                                    <div data-bind="visible: $root.render()=='home'">@Html.Partial("Home/Index")</div>
                                    <div data-bind="visible: $root.render()=='confirmation'" style="display: none">@Html.Partial("Home/Confirmation")</div>
                                    <div data-bind="visible: $root.render()=='profiles'" style="display: none">@Html.Partial("MyAccount/MyProfiles")</div>
                                    <div data-bind="visible: $root.render()=='experts'" style="display: none">@Html.Partial("ExpertProfile/Index")</div>
                                    <div data-bind="visible: $root.render()=='companies'" style="display: none">@Html.Partial("CompanyProfile/Index")</div>
                                    <div data-bind="visible: $root.render()=='Positions'" style="display: none">@Html.Partial("Position/Index")</div>
                                    <div data-bind="visible: $root.render()=='education'" style="display: none">@Html.Partial("Education/Index")</div>
                                    <div data-bind="visible: $root.render()=='categories'" style="display: none">@Html.Partial("Category/Index")</div>
                                    <div data-bind="visible: $root.render()=='countries'" style="display: none">@Html.Partial("Country/Index")</div>
                                    <div data-bind="visible: $root.render()=='technologies'" style="display: none">@Html.Partial("Technology/Index")</div>
                                    <div data-bind="visible: $root.render()=='languages'" style="display: none">@Html.Partial("Language/Languages")</div>
                                    <div data-bind="visible: $root.render()=='messages'" style="display: none">@Html.Partial("MessageFolder/Index")</div>
                                </div>
                                @Html.Partial("Partial/SignIn")
                                @Html.Partial("Partial/Register")
                                <!--DELETE-->
                                @Html.Partial("MyAccount/Partial/MyExpertProfiles/DeleteDialog")
                                @Html.Partial("MyAccount/Partial/MyPositions/DeletePositionDialog")
                                @Html.Partial("MyAccount/Partial/MyCompanyProfiles/DeleteCompanyDialog")
                                @RenderBody()
                            </div>
        
       
                            <script type="text/javascript">
                                
                                var auth = "@(Request.Cookies[FormsAuthentication.FormsCookieName] == null ? string.Empty : Request.Cookies[FormsAuthentication.FormsCookieName].Value)";
                                var username = "@((Session["User"] as User) != null ? (Session["User"] as User).Username : "")";

                                $(function() {
                                    ko.applyBindings(new MainViewModel);
                                });
                            </script>
                            <script type="text/javascript">
                                var _gaq = [['_setAccount', 'UA-XXXXX-X'], ['_trackPageview']];
                                // Change UA-XXXXX-X to be your site's ID
                                (function(d, t) {
                                    var g = d.createElement(t), s = d.getElementsByTagName(t)[0];
                                    g.async = 1;
                                    g.src = ('https:' == location.protocol ? '//ssl' : '//www') + '.google-analytics.com/ga.js';
                                    s.parentNode.insertBefore(g, s);
                                }(document, 'script'));
                            </script>
                        </body>
                    </html>